<template>
	<view class="mainpadding2" style="padding-bottom: 150rpx;">
		<view class="flexcenter" v-if="!list.data.length">
			<view class="placeholderimage" style="margin-top: 300rpx;" ></view>
		</view>
		<view class="flexbetween xiahuaxian margin_top" v-for="item in list.data" :key="item.id"
			@click="item.ischeck = !item.ischeck">
			<view class="flexleft">
				<image :src="item.user.avatar_text" class="headimg" mode=""></image>
				<view class="">
					<view class="ershiba strongtext">{{item.user.mobile}}</view>
					<view class="flexleft" v-if="item.user.gender==1">
						<image src="../static/image/system/girl.png" style="width: 40rpx;height: 40rpx;" mode=""></image>
						<!-- <view class="ershiba strongtext xiaolv margin_left">女</view> -->
					</view>
					<view class="flexleft" v-if="item.user.gender==0">
						<image src="../static/image/system/boy.png" style="width: 40rpx;height: 40rpx;" mode=""></image>
						<!-- <view class="ershiba strongtext xiaolv margin_left">女</view> -->
					</view>
					
					<!-- <view class="nan"></view> -->
				</view>
			</view>
			<view class="flexright" v-if="type==1">
				<u-icon class="" name="checkmark-circle-fill" v-show="!item.ischeck" color="#999"></u-icon>
				<u-icon class="" name="checkmark-circle-fill" v-show="item.ischeck" color="#1BA95B"></u-icon>
			</view>
		</view>
		<view class="gudingdb mainpadding">
			<view class="bigbtn" v-if="type==1" @click="checkryfn">确认</view>
			<view class="bigbtn" v-if="type==0" @click="addshow=true">添加成员</view>
		</view>
		<u-modal :show="addshow" title="添加成员" @close="addshow=false" showCancelButton @cancel="addshow=false"
			@confirm="tjcy">
			<view class="slot-content">
				<input type="number" placeholder="请输入添加成员手机号" v-model="mobile">
			</view>
		</u-modal>
	</view>
</template>

<script>
	const httpRequest = require("@/common/httpRequest.js")
	export default {
		data() {
			return {
				mobile: "",
				addshow: false,
				page: 1,
				limit: 12,
				list: {
					data: []
				},
				type: 0,
				checkids:[],
				// team_num:0,
				// womam_num:0,
				// man_num:0,
				user_zbfapply_listid:""
			}
		},
		onLoad(options) {
			this.user_zbfapply_listid=options.user_zbfapply_listid
			if (options.type) {
				this.type = options.type
				console.log(options.ids,"999");
				this.checkids = JSON.parse(options.ids)
				console.log(checkids,"9991");
				// this.team_num = options.team_num
				// this.womam_num = options.womam_num
				// this.man_num = options.man_num
			}
		},
		onShow() {
			this.init()
		},
		methods: {
			init(isPage, page) {
				let _this = this;
				let data = {
					page: page || 1,
					limit: _this.limit,
					user_zbfapply_id:this.user_zbfapply_listid
				}
				let url = '/api/user/teamUserIndex'
				httpRequest.request(url, 'GET', data, false, false, true).then(res => {
					if (res.code == 1) {
						res.data.data.forEach(item => {
							this.$set(item, "ischeck", false)
							this.checkids.forEach(ite=>{
								if(ite.id==item.user_id){
									item.ischeck = true
								}
							})
						})
						let resList = res.data;
						let dataList = _this.list;
						if (isPage == true) {
							_this.list.data = dataList.data.concat(resList.data);
						} else {
							this.list = res.data
							_this.list.data = resList.data;
						}
					}
				})
			},
			onReachBottom() {
				let _this = this;
				let list = _this.list;
				let page = _this.page;
				if (list.last_page <= page) {
					return false;
				}
				page++;
				_this.page = page;
				_this.init(true, page);
			},
			checkryfn(){
				let arr = []
				this.list.data.forEach(item=>{
					if(item.ischeck){
						arr.push({
							id:item.user_id,
							grande:item.user.gender
						})
					}
				})
				if(arr.length==0){
					httpRequest.toast("请选择队员")
					return false
				}
				uni.$emit("checkry",arr)
				uni.navigateBack(1)
			},
			tjcy() {
				if (this.mobile == "") {
					httpRequest.toast("请输入手机号")
					return false
				}
				this.addshow = false
				httpRequest.request('/api/user/addTeamUser', 'GET', {
					mobile: this.mobile,
					user_zbfapply_id:this.user_zbfapply_listid
				}).then(res => {
					httpRequest.toast(res.msg)
					if (res.code == 1) {
						this.init()
					}
				})
			},
		}
	}
</script>

<style>
	.headimg {
		width: 80rpx;
		height: 80rpx;
		min-width: 80rpx;
		border-radius: 50%;
		margin-right: 10rpx;
	}
</style>